<template>
	<div class="personal-infos">
		<div class="personal-infos-l">
			你好，<span>{{ userInfos?.sysUser?.username }}</span>
		</div>
		<div class="personal-infos-t">{{ userInfos?.deptName }}</div>
	</div>
</template>
<script setup lang="ts">
import { getUserInfo } from '/@/api/common';
import { Local } from '/@/utils/storage';
const userInfos = ref({});
onMounted(() => {
	const info = Local.get('userInfos');
	if (!info) {
		getUserInfo(Local.get('token')).then((res: any) => {
			if (res.ok) {
				Local.set('userInfos', res.data);
				userInfos.value = res.data;
			}
		});
	} else {
		userInfos.value = info;
	}
});
</script>
<style lang="scss" scoped>
.personal-infos {
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 20px;
	background-color: #fff;
	box-shadow: 0 1px 5px 0 #00000029;

	.personal-infos-l {
		margin-bottom: 5px;
		font-size: 16px;
		font-weight: bold;
		color: #000;
	}

	.personal-infos-t {
		font-family: 'Microsoft YaHei';
		font-size: 14px;
		font-weight: 400;
		line-height: 14px;
		color: #303133;
	}
}
</style>
